import { Component, Input, EventEmitter, Output } from '@angular/core';

@Component({
  selector: 'app-pink',
  templateUrl: './pink.component.html',
  styleUrls: ['./pink.component.css'],
})
export class PinkComponent {
  // 父组件的传参使用Input()装饰器
  // 相当于vue的子组件的props的声明
  @Input() sonCount: number = 0;

  // 声明父组件传递过来的方法
  // 此处注意this 的指向问题
  @Input() deleteClick: Function = () => {};

  // 事件发生器，输出类型属性
  @Output() deleteEvent = new EventEmitter();

  @Output() parmasEvent = new EventEmitter();


  emitClick() {
    this.deleteEvent.emit();
  }

  propsClick() {
    this.deleteClick();
  }

  handlerClick(e: any) {
    console.log('原生dom事件', e);
    this.parmasEvent.emit('自定义事件')
  }
}
